<!DOCTYPE html>
<html lang="en" style="background:#fff;">
<head>
    <base href="${basePath}">
    <#include "common/top.html"/>
    <link type="text/css" rel="stylesheet" href="${basePath}plugins/zTree/3.5.1/zTreeStyle/zTreeStyle.css"/>
    <script type="text/javascript" src="${basePath}plugins/zTree/3.5.1/jquery.ztree.core.js"></script>
    <script type="text/javascript" src="${basePath}plugins/zTree/3.5.1/jquery.ztree.excheck.js"></script>
</head>
<body style="background:#fff;">
<form class="layui-form" modelAttribute="mDept" name="form" id="form" method="post">
    <input type="hidden" name="deptId" id="deptId" value="${mDept.deptId }"/>
    <div class="layui-form-item">
        <label class="layui-form-label">机构：</label>
        <div class="layui-input-inline">
            <input class="layui-input" type="hidden" name="parentId" id="parentId" placeholder="机构"
                   value="${mDept.parentId}" title="机构"/>
            <input class="layui-input" type="text" readonly name="parentName" id="parentName" placeholder="机构"
                   value="${mDept.parentName}" title="机构"/>
            <div id="parentDiv" class="layui-elem-field" style="height: 200px;overflow: auto;">
                <ul id="tree" class="ztree" style="padding: 5px;"></ul>
            </div>
        </div>
    </div>

    <div class="layui-form-item layui-form-item-dialog">
        <label class="layui-form-label"><span style="color: red;">*</span>角色:</label>
        <div class="layui-input-inline">
            <select id="roleId" name="roleId" lay-filter="roleId" lay-verify="" lay-search>
                <option value=""></option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span style="color: red;">*</span>用户名：</label>
        <div class="layui-input-inline">
            <input class="layui-input" type="text" name="operatorId" id="operatorId" placeholder="请输入用户名" title="用户名"/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span style="color: red;">*</span>用户姓名：</label>
        <div class="layui-input-inline">
            <input class="layui-input" type="text" name="operatorName" id="operatorName" placeholder="请输入用户姓名" value=""
                   title="用户姓名"/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span style="color: red;">*</span>手机号：</label>
        <div class="layui-input-inline">
            <input class="layui-input" type="text" name="phone" id="phone" placeholder="请输入手机号" value="" title="手机号"/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span style="color: red;">*</span>邮箱：</label>
        <div class="layui-input-inline">
            <input class="layui-input" type="text" name="email" id="email" placeholder="请输入邮箱" value="" title="邮箱"/>
        </div>
    </div>

</form>
</body>
<script type="text/javascript">

    var $form;
    var form;
    layui.use(['form', 'layedit', 'laydate'], function () {
        form = layui.form();
        $("#roleId option").each(function () {
            if ($(this).val() == "") {
                $(this).attr("selected", true);
            }
        });
        form.render();
    });
    var form;
    layui.use(['form'], function () {
        form = layui.form();
    });
    var zTree;
    $(document).ready(function(){
        if($("#deptId").val() != '' && $("#deptId").val() != null){
            bName = true;
        }
        $("#parentDiv").hide();
        $("#parentName").click(function(event){
            if($("#deptId").val()== ''){
                $("#parentDiv").show();
                event.stopPropagation();//阻止冒泡
            }
        });
        $("body").click(function(){
            $("#parentDiv").hide();
        })
        $('#parentDiv').click(function(){
            return false;
        });
        var zn = '<#noescape>${zTreeNodes}</#noescape>';
        debugger
        var setting = {
            data: {
                key: {
                    title: "dept"
                },
                simpleData: {
                    enable: true,
                    idKey: "id",
                    pIdKey: "pId",
                    rootPId: 0
                }
            },
            callback:{
                onClick: zTreeOnClick
            }
        };
        var zNodes = eval(zn);
        zTree = $.fn.zTree.init($("#tree"), setting, zNodes);
    });
    function zTreeOnClick(event, treeId, treeNode) {
        $("#parentId").val(treeNode.id);
        $("#parentName").val(treeNode.name);
        $("#parentDiv").hide();
    }
    //保存
    function save() {
        $.ajax({
            url: "${basePath}/sysuser/merchant/saveOperator",
            data: $("#form1").serialize(),
            type: "POST",
            success: function (data) {
                if (data.status == 'success') {
                    parent.layer.alert(data.msg, function (index) {
                        var index1 = parent.layer.getFrameIndex(window.name); //获取窗口索引
                        parent.layer.close(index1);
                        parent.layer.close(index);
                    });
                } else {
                    parent.layer.alert(data.msg);
                }
            }
        })
    }

</script>
</body>
</html>